﻿<UserControl x:Name="control" x:Class="Daytimer.Controls.SliderControl"
		xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
		xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
		xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
		xmlns:Ribbon="clr-namespace:Microsoft.Windows.Controls.Ribbon;assembly=RibbonControlsLibrary"
		xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:src="clr-namespace:Daytimer.Controls"
		mc:Ignorable="d" d:DesignHeight="22" Foreground="#FFFCFDFE" Padding="8,0,0,0">
	<UserControl.Resources>
		<Style x:Key="controlButton" TargetType="Button">
			<Setter Property="Width" Value="8" />
			<Setter Property="Height" Value="8" />
			<Setter Property="VerticalAlignment" Value="Center" />
			<Setter Property="Focusable" Value="False" />
			<Setter Property="Cursor" Value="Arrow" />
			<Setter Property="Foreground" Value="{DynamicResource White}" />
			<Setter Property="Margin" Value="2,1,2,-1" />
			<Setter Property="Padding" Value="2" />
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="Button">
						<Border Background="Transparent">
							<Path HorizontalAlignment="Center" VerticalAlignment="Center"
									Data="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}"
									SnapsToDevicePixels="True" StrokeThickness="2">
								<Path.Stroke>
									<SolidColorBrush x:Name="stroke" Color="{TemplateBinding Foreground}" />
								</Path.Stroke>
							</Path>
							<VisualStateManager.VisualStateGroups>
								<VisualStateGroup x:Name="CommonStates">
									<VisualState x:Name="Normal">
										<Storyboard>
											<ColorAnimationUsingKeyFrames Storyboard.TargetName="stroke"
													Storyboard.TargetProperty="Color">
												<EasingColorKeyFrame KeyTime="0" Value="{DynamicResource WhiteColor}" />
											</ColorAnimationUsingKeyFrames>
										</Storyboard>
									</VisualState>
									<VisualState x:Name="MouseOver">
										<Storyboard>
											<ColorAnimationUsingKeyFrames Storyboard.TargetName="stroke"
													Storyboard.TargetProperty="Color">
												<EasingColorKeyFrame KeyTime="0"
														Value="{DynamicResource ZoomSliderOverColor}" />
											</ColorAnimationUsingKeyFrames>
										</Storyboard>
									</VisualState>
									<VisualState x:Name="Pressed">
										<Storyboard>
											<ColorAnimationUsingKeyFrames Storyboard.TargetName="stroke"
													Storyboard.TargetProperty="Color">
												<EasingColorKeyFrame KeyTime="0"
														Value="{DynamicResource ZoomSliderPressedColor}" />
											</ColorAnimationUsingKeyFrames>
										</Storyboard>
									</VisualState>
									<VisualState x:Name="Disabled">
										<Storyboard>
											<ColorAnimationUsingKeyFrames Storyboard.TargetName="stroke"
													Storyboard.TargetProperty="Color">
												<EasingColorKeyFrame KeyTime="0" Value="#55000000" />
											</ColorAnimationUsingKeyFrames>
										</Storyboard>
									</VisualState>
								</VisualStateGroup>
							</VisualStateManager.VisualStateGroups>
						</Border>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
		<src:PercentConverter x:Key="percentConverter" />
	</UserControl.Resources>
	<UserControl.Template>
		<ControlTemplate TargetType="UserControl">
			<ContentPresenter Margin="{TemplateBinding Padding}" />
		</ControlTemplate>
	</UserControl.Template>
	<Grid>
		<Grid.ColumnDefinitions>
			<ColumnDefinition Width="Auto" />
			<ColumnDefinition Width="*" />
			<ColumnDefinition Width="Auto" />
			<ColumnDefinition Width="Auto" />
		</Grid.ColumnDefinitions>
		<Button x:Name="decreaseSliderButton" Content="M 0 0 6 0" Click="decreaseSliderButton_Click"
				IsEnabled="{Binding IsEnabled, ElementName=control}" Style="{DynamicResource controlButton}"
				ToolTip="Zoom Out" />
		<Slider x:Name="slider" Grid.Column="1" VerticalAlignment="Center" HorizontalAlignment="Stretch" Maximum="150"
				Value="100" Minimum="50" IsMoveToPointEnabled="True" LargeChange="100" SmallChange="10"
				IsEnabled="{Binding IsEnabled, ElementName=control}" ValueChanged="slider_ValueChanged"
				IsSnapToTickEnabled="True" TickFrequency="10" Focusable="False" Margin="1,0,2,0" Width="100"
				ToolTip="Zoom">
			<Slider.Template>
				<ControlTemplate TargetType="Slider">
					<Border x:Name="border" SnapsToDevicePixels="True">
						<Grid>
							<Border x:Name="TrackBackground" Background="{DynamicResource White}" Height="1"
									VerticalAlignment="Center">
								<Grid Margin="-6,-2">
									<Canvas>
										<Rectangle x:Name="PART_SelectionRange" Fill="{DynamicResource White}"
												Height="4" Visibility="Hidden" />
									</Canvas>
									<Path Data="M 0.5 0 0.5 5" StrokeThickness="1" Stroke="{DynamicResource White}"
											HorizontalAlignment="Center" VerticalAlignment="Center"
											SnapsToDevicePixels="True" />
								</Grid>
							</Border>
							<Track x:Name="PART_Track" Focusable="False">
								<Track.DecreaseRepeatButton>
									<RepeatButton Command="Slider.DecreaseLarge">
										<RepeatButton.Style>
											<Style TargetType="RepeatButton">
												<Setter Property="OverridesDefaultStyle" Value="True" />
												<Setter Property="Background" Value="Transparent" />
												<Setter Property="Focusable" Value="False" />
												<Setter Property="IsTabStop" Value="False" />
												<Setter Property="Template">
													<Setter.Value>
														<ControlTemplate TargetType="RepeatButton">
															<Rectangle Fill="{TemplateBinding Background}"
																	Height="{TemplateBinding Height}"
																	Width="{TemplateBinding Width}" />
														</ControlTemplate>
													</Setter.Value>
												</Setter>
											</Style>
										</RepeatButton.Style>
									</RepeatButton>
								</Track.DecreaseRepeatButton>
								<Track.IncreaseRepeatButton>
									<RepeatButton Command="Slider.IncreaseLarge">
										<RepeatButton.Style>
											<Style TargetType="RepeatButton">
												<Setter Property="OverridesDefaultStyle" Value="True" />
												<Setter Property="Background" Value="Transparent" />
												<Setter Property="Focusable" Value="False" />
												<Setter Property="IsTabStop" Value="False" />
												<Setter Property="Template">
													<Setter.Value>
														<ControlTemplate TargetType="RepeatButton">
															<Rectangle Fill="{TemplateBinding Background}"
																	Height="{TemplateBinding Height}"
																	Width="{TemplateBinding Width}" />
														</ControlTemplate>
													</Setter.Value>
												</Setter>
											</Style>
										</RepeatButton.Style>
									</RepeatButton>
								</Track.IncreaseRepeatButton>
								<Track.Thumb>
									<Thumb x:Name="Thumb" Focusable="False" Height="11" OverridesDefaultStyle="True"
											VerticalAlignment="Center" Width="4">
										<Thumb.Template>
											<ControlTemplate TargetType="Thumb">
												<Grid HorizontalAlignment="Center" UseLayoutRounding="True"
														VerticalAlignment="Center">
													<Path x:Name="grip" Data="M 0 0 3 0 3 10 0 10 Z"
															Fill="{DynamicResource White}" Stretch="Fill"
															SnapsToDevicePixels="True" UseLayoutRounding="True"
															VerticalAlignment="Center" />
												</Grid>
												<ControlTemplate.Triggers>
													<Trigger Property="IsMouseOver" Value="True">
														<Setter Property="Fill" TargetName="grip"
																Value="{DynamicResource ZoomSliderOver}" />
													</Trigger>
													<Trigger Property="IsDragging" Value="True">
														<Setter Property="Fill" TargetName="grip"
																Value="{DynamicResource ZoomSliderPressed}" />
													</Trigger>
													<Trigger Property="IsEnabled" Value="False">
														<Setter Property="Visibility" TargetName="grip"
																Value="Collapsed" />
													</Trigger>
												</ControlTemplate.Triggers>
											</ControlTemplate>
										</Thumb.Template>
									</Thumb>
								</Track.Thumb>
							</Track>
						</Grid>
					</Border>
					<ControlTemplate.Triggers>
						<Trigger Property="IsSelectionRangeEnabled" Value="True">
							<Setter Property="Visibility" TargetName="PART_SelectionRange" Value="Visible" />
						</Trigger>
						<Trigger Property="IsKeyboardFocused" Value="True">
							<Setter Property="Foreground" TargetName="Thumb" Value="Blue" />
						</Trigger>
					</ControlTemplate.Triggers>
				</ControlTemplate>
			</Slider.Template>
		</Slider>
		<Button x:Name="increaseSliderButton" Grid.Column="2" Content="M 4 0 4 8 M 0 4 8 4"
				Click="increaseSliderButton_Click" IsEnabled="{Binding IsEnabled, ElementName=control}"
				Style="{DynamicResource controlButton}" ToolTip="Zoom In" />
		<Button x:Name="text" Grid.Column="3" Padding="8,0" Margin="6,0,0,0" FontSize="11" FontWeight="SemiBold"
				Width="Auto" Height="Auto" MinWidth="0"
				Content="{Binding Value, ElementName=slider, Converter={StaticResource percentConverter}}"
				HorizontalAlignment="Center" VerticalAlignment="Stretch" Foreground="#FFFCFDFE" Background="Transparent"
				Click="text_Click">
			<Button.ToolTip>
				<Ribbon:RibbonToolTip Title="Zoom Level" Description="Click to open the Zoom dialog box." />
			</Button.ToolTip>
			<Button.Template>
				<ControlTemplate TargetType="Button">
					<Border x:Name="bg" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}">
						<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
					</Border>
					<ControlTemplate.Triggers>
						<Trigger Property="IsMouseOver" Value="True">
							<Setter Property="Background" TargetName="bg" Value="#30FFFFFF" />
						</Trigger>
						<Trigger Property="IsPressed" Value="True">
							<Setter Property="Background" TargetName="bg" Value="#20000000" />
						</Trigger>
						<Trigger Property="IsEnabled" Value="False">
							<Setter Property="Opacity" TargetName="bg" Value="0.8" />
						</Trigger>
					</ControlTemplate.Triggers>
				</ControlTemplate>
			</Button.Template>
		</Button>
	</Grid>
</UserControl>
